<template>
  <div class="app-container">
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="镜像" name="mirror">
        <el-table :data="list" border fit highlight-current-row>
          <el-table-column type="index">
          </el-table-column>
          <el-table-column label="hwcode">
            <template slot-scope="{ row }">
              <span @click="copy(row.appname)">
                {{ row.hwcode }}
              </span>
            </template>
          </el-table-column>
          <el-table-column label="username">
            <template slot-scope="{ row }">
              <span @click="copy(row.username)">
                {{ row.username }}
              </span>
            </template>
          </el-table-column>
          <el-table-column label="phone">
            <template slot-scope="{ row }">
              <span @click="copy(row.phonenum)">
                {{ row.phonenum }}
              </span>
            </template>
          </el-table-column>
          <el-table-column label="userid">
            <template slot-scope="{ row }">
              <span @click="copy(row.userid)">
                {{ row.userid }}
              </span>
            </template>
          </el-table-column>
        </el-table>
      </el-tab-pane>
      <el-tab-pane label="现网" name="prod">
        <el-table :data="list" border fit highlight-current-row>
          <el-table-column type="index">
          </el-table-column>
          <el-table-column label="hwcode">
            <template slot-scope="{ row }">
              <span @click="copy(row.appname)">
                {{ row.hwcode }}
              </span>
            </template>
          </el-table-column>
          <el-table-column label="username">
            <template slot-scope="{ row }">
              <span @click="copy(row.username)">
                {{ row.username }}
              </span>
            </template>
          </el-table-column>
          <el-table-column label="phone">
            <template slot-scope="{ row }">
              <span @click="copy(row.phonenum)">
                {{ row.phonenum }}
              </span>
            </template>
          </el-table-column>
          <el-table-column label="userid">
            <template slot-scope="{ row }">
              <span @click="copy(row.userid)">
                {{ row.userid }}
              </span>
            </template>
          </el-table-column>
        </el-table>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import request from '@/utils/request'

export default {
  data() {
    return {
      activeName: 'mirror',
      list: []
    }
  },
  created() {
    this.getUidsList('mirror')
  },
  methods: {
    async getUidsList(env) {
      this.list = []
      const appids = await request({
        url: `/uid/list`,
        method: 'get',
        params: { env }
      })
      this.list.push(...appids)
    },
    handleClick(tab) {
      this.getUidsList(tab.name)
    },
    copy(rt) {
      this.$copyText(rt).then(e => {
        this.$notify({
          title: '成功',
          message: '复制成功!',
          type: 'success'
        })
      }, e => {
        this.$notify.error({
          title: '失败',
          message: '复制RT失败!'
        })
      })
    }
  }
}
</script>

<style scoped>

</style>
